<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>天地图-地图参数设置</title>
		<link rel="stylesheet" type="text/css" href="../css/common.css"></link>
    </head>
    <body> 
        <!--地图容器-->
		<div id="mapDiv" style="height: 450px;margin: 2%;"></div>
		
		<div class="content" align="center">
			<a class="button" href="javascript:void(0);" id="button1">设置经纬度和缩放级别</a>
			<a class="button" href="javascript:map.enableDoubleClickZoom()">允许双击地图放大</a>
			<a class="button" href="javascript:map.disableDoubleClickZoom()">禁止双击地图放大</a>
			<a class="button" href="javascript:map.enableScrollWheelZoom()">允许鼠标滚轮缩放地图</a>
			<a class="button" href="javascript:map.disableScrollWheelZoom()">禁止鼠标滚轮缩放地图</a>
        </div>
		
		<div class="content" align="center">
			<a class="button" href="javascript:map.enableInertia()">允许鼠标地图惯性拖拽</a>
			<a class="button" href="javascript:map.disableInertia()">禁止鼠标地图惯性拖拽</a>
			<a class="button" href="javascript:map.enableKeyboard()">允许键盘操作地图</a>
			<a class="button" href="javascript:map.disableKeyboard()">禁止键盘操作地图</a>
			<a class="button" href="javascript:map.setStyle('black')">样式:黑</a>
			<a class="button" href="javascript:map.setStyle('indigo')">样式:靛蓝</a>
			<a class="button" href="javascript:map.removeStyle()">恢复样式</a>
        </div>
		
		<div class="content" align="center">
			<a class="button button13" href="javascript:void(0)" type="TMAP_NORMAL_MAP">普通街道视图</a>
			<a class="button button13" href="javascript:void(0)" type="TMAP_SATELLITE_MAP">卫星视图</a>
			<a class="button button13" href="javascript:void(0)" type="TMAP_HYBRID_MAP">卫星和路网的混合视图</a>
			<a class="button button13" href="javascript:void(0)" type="TMAP_TERRAIN_MAP">地形视图</a>
			<a class="button button13" href="javascript:void(0)" type="TMAP_TERRAIN_HYBRID_MAP">地形和路网的混合视图</a>
		</div>
        
    </body>
	<script type="text/javascript" src="../js/jquery-1.8.3.min.js"></script>
	<script type="text/javascript" src="../layer/layer.js"></script>
    <script type="text/javascript" src="http://api.tianditu.gov.cn/api?v=4.0&tk=e83d04f3e04272b8d9e91615e309fe36"></script>
    <script type="text/javascript">
        var map;
        var zoom = 12;    
		$(document).ready(function (){
			//初始化地图对象
            map = new T.Map("mapDiv");
            //设置显示地图的中心点和级别
            map.centerAndZoom(new T.LngLat(116.40969, 39.89945), zoom);
		});
		
		/*设置经纬度和缩放级别*/
		$("#button1").click(function(){
			layer.prompt({title: '请输入经度', formType: 0}, function(lng, index){
				layer.close(index);
				layer.prompt({title: '请输入纬度', formType: 0}, function(lat, index){
					layer.close(index);
					layer.prompt({title: '请输入缩放级别', formType: 0}, function(zoom, index){
						layer.close(index);
						map.centerAndZoom(new T.LngLat(lng, lat), zoom);
					});
				});
			});
		});
		
		/*设置地图投影类型*/
		$(".button13").click(function(){
			var type = $(this).attr("type");
            map.removeControl(eval(type));
            map.addControl(eval(type));
		});
		
    </script>
</html>